@mixin btn-can-click {
    transition: 0.5s opacity;
    opacity: 1;

    &:hover {
        opacity: .7;
    }

    &:active {
        opacity: .5;
    }
}

.button-default {
    background: $Gray3;
    border: 1px solid $Gray6;
    height: 40px;
    line-height: 40px;
    border-radius: 2px;
    color: $White;
    transition: background $speed;
    &:hover {
        background: $Gray5;
        border: 1px solid $Gray9;
    }
}

.button-transparent {
    border-radius: 2px;
    text-decoration: none;
    cursor: pointer;
    display: inline-block;
    line-height: 31px;
    background: $T;
    color: $White;
    height: 35px;
    border: 1px solid $Gray6;
    padding: 0 10px;
    transition: background $speed;
    text-align: center;
    &:hover {
        background: $White1;
    }
}

input[type=checkbox] {
    margin: 0;
}

.inputs-checkbox {
    display: none;
}

.checkbox-label {
    cursor: pointer;
    margin: 0;
    float: left;
    display: inline-block;
    width: 32px;
    height: 32px;
    transition: background .5s;
    background: url('../img/checkbox_unchecked.png') no-repeat 100% 100%;
    &.is-selected {
        background: url('../img/checkbox-checked.png') no-repeat 100% 100%;
    }
}

.img-5-7-height {
    $screen-lg-min-width: 324px;
    $screen-md-min-width: 324*.67143068px;
    $screen-sm-min-width: 324*.67143068*.72475044px;
    @media (min-width: $screen-sm-min) {
        height: $screen-sm-min-width*7/5;
    }
    @media (min-width: $screen-md-min) {
        height: $screen-md-min-width*7/5;
    }
    @media (min-width: $screen-lg-min) {
        height: $screen-lg-min-width*7/5;
    }
}